<template>
  <view class="page" id="loginphone">
    <view class="logo pad-login-bot"> <image class="logo_img" mode="widthFix" :src="logo" /> </view>
    <view class="login-box">
      <view class="color_theme protocol protocol-view" @click="onChecked">
        <checkbox @click="checked = !checked" value=" 1" :checked="checked" />
        <text @click="openProtocol">同意痒痒狗隐私协议</text>
      </view>
      <view class="login-card-loginIn">
        <button class="phoneBtn" open-type="getPhoneNumber" @getphonenumber="onGetphonenumber">手机号快捷登录</button>
      </view>
    </view>
    <uni-drawer :width="windowWidth" ref="showProtocolRef" mode="right" :mask-click="false">
      <uni-nav-bar @clickLeft="closeProtocol" left-icon="left" title="隐私协议" />
      <scroll-view scroll-y="true" style="height: 95vh">
        <rich-text :nodes="protocol"></rich-text>
      </scroll-view>
    </uni-drawer>
  </view>
</template>
<script lang="ts" setup>
import logo from '@/static/images/dog_logo.png';
import { ref } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
import { sign, setShareInfo, getPhoneNumberApi } from '@/api/bgame';
import { useUserStoreHook } from '@/store/user';
import Toast from '@/utils/toast';
const showProtocolRef = ref();
const mallconfig = ref(0);
const checked = ref(false);
const windowWidth = ref(0);
const protocol = ref(
  '<p style="text-align: center;"><strong>用户协议</strong></p><p style="text-align: center;"><br></p><p>《用户协议》（以下简称“本协议”）是江西柚惠科技有限公司（以下简称“柚惠”）与痒痒狗用户（以下简称“您”）就痒痒狗的使用事项所订立的有效合约。<strong>您通过网络页面、手机页面点击确认或以其他方式选择接受本协议，即表示您与柚惠及与柚惠合作机构已达成协议并同意接受本协议的全部约定内容。您不得以账户密码、私钥等账户信息被盗用或其他理由否认本协议的法律效力或不按照本协议履行相关义务。</strong></p><p><br></p><p><strong>&nbsp;</strong></p><p><br></p><p><strong>第一章</strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong>定义</strong></p><p><br></p><p><strong>第一条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;痒痒狗由柚惠全新推出，致力于打造“一站式数字化企业服务平台”框架下的又一企业服务模块，她以独特的商业模式、和创新玩法，打造了一款把</p><p>“游戏+社交电商+同城消费” 联动的游戏电商平台。</p><p><br></p><p>&nbsp;</p><p><br></p><p><strong>第二章</strong>&nbsp;&nbsp;<strong>&nbsp;&nbsp;痒痒狗服务内容及您的承诺</strong></p><p><br></p><p><strong>第二条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;柚惠向您提供痒痒狗软件上相应的网络空间、技术支持和系统维护，以及同意向您提供的各项附属功能、增值服务等。</p><p><br></p><p><strong>第三条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您在使用过程中所遇到的相关问题可向柚惠工作人员或通过服务电话向柚惠进行咨询。</p><p><br></p><p><strong>第四条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您承诺您的账户仅限本人或授权人使用，不得转给他人使用。账号下的行为视作本人意愿，如因密码泄露、出借等原因造成不良后续结果，您将承担相应的责任。</p><p><br></p><p><strong>第五条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;痒痒狗是柚惠一款把 “游戏+社交电商+同城消费” 联动的游戏电商平台。但是，柚惠不能控制信息的真实性或准确性。本公司不能也不会控制寄递各方能否履行各方线下协议的义务。</p><p><br></p><p><strong>第六条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您使用痒痒狗登记店家信息时，应仔细填写店家信息，并保证上述您填写信息的准确性、有效性、完整性。如因您填写的信息不准确、无效或不完整，导致您的业务无法顺利履行，您应自行承担全部责任。</p><p><br></p><p><strong>第七条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;柚惠作为独立第三方，可提供您或争议相对方有关的平台数据资料，但不对争议事实等做判断。</p><p><br></p><p><strong>第九条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;柚惠根据用户在本平台的操作行为，可对违反本用户协议相关条款的用户账号进行账号冻结。</p><p><br></p><p><strong>第十二条</strong>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;为了更好的向客户提供优质服务，您同意柚惠管理您在痒痒狗小程序上的数据（包括用户信息、运单信息等）。</p><p><br></p><p><strong>第十三条</strong>&nbsp;&nbsp;&nbsp;<strong>您同意，柚惠可自行全权决定以任何理由&nbsp;(包括但不限于痒痒狗认为您已违反本协议的字面意义和精神，或以不符合本协议的字面意义和精神的方式行事)&nbsp;终止您在痒痒狗的密码、帐户&nbsp;(或其任何部份)&nbsp;或痒痒狗对您提供的服务，并删除和丢弃您在使用服务中提交的资料。</strong></p><p><br></p><p><strong>&nbsp;</strong>&nbsp;</p><p><br></p><p><strong>第三章</strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong>保密条款</strong></p><p><br></p><p><strong>第十七条</strong>&nbsp;&nbsp;&nbsp;&nbsp;双方必须对合同签订、履行过程中获悉的对方所有商业信息、资料承担保密职责。未经对方书面同意，不得向对方以外的任何第三方（关联公司除外）泄露、给予或转让该等保密信息，若违反本规定给对方造成损失的一方应承担全部赔偿责任。</p><p><br></p><p><strong>第十八条</strong>&nbsp;在本协议终止之后，各方在本条款项下的义务并不随之终止，各方仍需遵守本协议之保密条款，履行其所承诺的保密义务，直到其他方同意其解除此项义务，或事实上不会因违反本协议的保密条款而给其他方造成任何形式的损害时为止。</p><p><br></p><p><strong>第十九条</strong>&nbsp;均应告知并督促其因履行本协议之目的而必须获知本协议内容及因合作而获知对方商业秘密的雇员、代理人、顾问等遵守保密条款，并对其雇员、代理人、顾问等的行为承担责任。</p><p><br></p><p>&nbsp;</p><p><br></p><p><strong>第五章</strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong>合同变更、服务终止、合同解除</strong></p><p><br></p><p><strong>第一节</strong>&nbsp;&nbsp;<strong><u>合同变更</u></strong></p><p><br></p><p><strong>第二十条</strong>&nbsp;如本协议发生变更，柚惠将通过官方网站或者软件内公告的方式提前予以公布，变更后的协议在公告期届满起生效。</p><p><br></p><p><strong>第二十一条</strong>&nbsp;若您在协议生效后继续使用痒痒狗软件的，表示您接受变更后的协议，协议具有同等法律效力。</p><p><br></p><p>&nbsp;</p><p><br></p><p><strong>第二节</strong>&nbsp;&nbsp;<strong><u>终止服务、解除合同的特别约定</u></strong></p><p><br></p><p><strong>第二十二条</strong>&nbsp;<strong>存在如下情形时，柚惠会对您名下会员账户暂停或终止提供服务，且有权限制您所使用的产品或服务功能，并解除合同，该等情况下不视为柚惠违约：</strong></p><p><br></p><p><strong>(一)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;根据法律法规及法律文书的规定。</strong></p><p><br></p><p><strong>(二)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;根据法律法规等有权采取查询、冻结或扣划资金等措施的单位的要求，包括但不限于公安机关、检察院、法院、海关、税务机关。</strong></p><p><br></p><p><strong>(三)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您违反了本协议。</strong></p><p><br></p><p><strong>(四)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您的账户操作、资金流向等存在异常或可能产生风险。</strong></p><p><br></p><p><strong>(五)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您在使用痒痒狗软件时有批量注册账户、刷信用、交易内容不符或作弊等违反诚实信用原则。</strong></p><p><br></p><p><strong>(六)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;冒用他人名义使用痒痒狗服务，未经授权使用他人银行卡。</strong></p><p><br></p><p><strong>(七)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;进行与您或交易对方宣称的交易内容不符的交易，或不真实的交易。</strong></p><p><br></p><p><strong>(八)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;从事不法交易行为，如洗钱、恐怖融资、贩卖枪支、毒品、禁药、盗版软件、黄色淫秽物品、其他柚惠认为不得使用痒痒狗服务进行交易的物品等。</strong></p><p><br></p><p><strong>(九)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;从事任何可能侵害痒痒狗服务系统、数据之行为。</strong></p><p><br></p><p><strong>除（一）、（二）规定的情形外，如您申请恢复服务、解除上述限制，请您向我们提供相关资料及身份证明等文件，以便柚惠进行核实。</strong></p><p><br></p><p><strong>&nbsp;</strong></p><p><br></p><p><strong>第六章</strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong>不可抗力免责条款</strong></p><p><br></p><p><strong>第二十三条</strong>&nbsp;<strong>因下列原因导致痒痒狗无法正常提供服务，柚惠不承担责任：</strong></p><p><br></p><p><strong>(一)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;对系统进行正常的停机维护或升级。</strong></p><p><br></p><p><strong>(二)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;因台风、地震、洪水、雷电、疫情或恐怖袭击等不可抗力原因。</strong></p><p><br></p><p><strong>(三)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您的电脑软硬件、通信线路、供电线路出现故障。</strong></p><p><br></p><p><strong>(四)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;因您操作不当或通过非痒痒狗授权或认可的方式使用痒痒狗服务。</strong></p><p><br></p><p><strong>(五)&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;因病毒、木马、恶意程序攻击、网络拥堵、系统不稳定、系统或设备故障、通讯故障、电力故障、银行原因&nbsp;、第三方服务瑕疵或政府行为等原因。</strong></p><p><br></p><p><strong>第二十四条</strong>&nbsp;尽管有前款约定，柚惠将采取合理行动积极促使服务恢复正常。</p><p><br></p><p>&nbsp;</p><p><br></p><p><strong>第七章</strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong>通知及送达</strong></p><p><br></p><p><strong>第二十五条</strong>&nbsp;您在注册成为痒痒狗用户，并接受痒痒狗服务时，您应该向柚惠提供真实有效的联系方式（包括您的电子邮件地址、联系电话、联系地址、传真电话等），对于联系方式发生变更的，您有义务及时更新有关信息，并保持可被联系的状态。</p><p><br></p><p><strong>第二十六条</strong>&nbsp;您在注册痒痒狗用户时生成的用于登陆痒痒狗接收系统消息和即时信息的会员账号（包括子账号），也作为您的有效联系方式。</p><p><br></p><p><strong>第二十七条</strong>&nbsp;&nbsp;&nbsp;&nbsp;柚惠通过上述联系方式向您发出通知，其中以电子的方式发出的书面通知，包括但不限于在痒痒狗软件公告，向您提供的联系电话发送手机短信，向您提供的电子邮件地址发送电子邮件，向您的账号发送系统消息，在发送成功后即视为送达；以纸质载体发出的书面通知，按照提供联系地址交邮后的第五个自然日即视为送达。</p><p><br></p><p>&nbsp;</p><p><br></p><p><strong>第八章</strong>&nbsp;&nbsp;&nbsp;&nbsp;<strong>其他</strong></p><p><br></p><p><strong>第二十八条</strong>&nbsp;本协议之效力、解释、变更、执行与争议解决均适用中华人民共和国法律，均应依照中华人民共和国法律予以处理。因本协议产生纠纷，双方应努力友好协商解决。若协商不成，您同意在柚惠住所地有管辖权的人民法院审理。</p>'
);
const setDrawerWidth = () => {
  let info = uni.getSystemInfoSync();
  windowWidth.value = info.windowWidth;
};
setDrawerWidth();

const openProtocol = () => {
  showProtocolRef.value.open();
};

const closeProtocol = () => {
  showProtocolRef.value.close();
};
const onChecked = () => {
  if ((!uni.getStorageSync('user_id') && 1 == mallconfig.value) || uni.getStorageSync('user_id') == 1375) {
    uni.navigateTo({
      url: '/pages/mall/index/protocol',
    });
  }
};

const onGetphonenumber = async (val) => {
  console.log('授权onGetphonenumber', val.detail.errMsg === 'getPhoneNumber:ok', val);
  if (!checked.value) {
    Toast.error('请勾选隐私协议');
    return;
  }
  let user_id = uni.getStorageSync('user_id');
  if (!user_id || !(Number(user_id) > 0)) {
    Toast.error('登录失败,请刷新小程序再登录');
    return;
  }
  if (val.detail.errMsg === 'getPhoneNumber:ok') {
    // 保存需要的 iv, encryptedData
    const { code } = val.detail;
    // const { iv, encryptedData, code } = val.detail;

    // 调用后台登录的接口，传递参数
    //  encryptedData: encodeURIComponent(encryptedData),
    const res: any = await getPhoneNumberApi({
      code: code,
    });
    console.log('反参', res);
    // 登陆成功
    if (1 == res.result) {
      // 保存token
      uni.setStorageSync('user_id', res.data.data.uid);
      uni.setStorageSync('user_avatarUrl', res.data.data.avatar);
      uni.setStorageSync('user_nickName', res.data.data.username);
      uni.setStorageSync('phone', res.data.data.mobile);
      uni.showToast({
        title: '登录成功',
        duration: 800,
        icon: 'success',
      });
      const share_user_id = uni.getStorageSync('share_user_id');
      if (share_user_id) {
        onSetShareInfo({
          rece_user_id: res.data.data.uid,
          share_user_id,
        });
        uni.setStorageSync('share_user_id', '');
      }

      const giftId = uni.getStorageSync('giftId');
      if (giftId && Number(giftId) > 0 && share_user_id && Number(share_user_id) > 0) {
        uni.showModal({
          title: '提示',
          content: `ID:${share_user_id}送你1张沐浴露礼包卡`,
          confirmText: '查收',
          cancelText: '取消',
          success: (res) => {
            if (res.confirm) {
              receiveGift({
                receive_id: res.data.data.uid,
                gift_receive_id: giftId,
              });
              uni.setStorageSync('giftId', '');
            }
          },
          complete: () => {
            uni.reLaunch({
              url: '/pages/dog/index',
            });
          },
        });
      } else {
        // 刷新回到用户页页面
        uni.reLaunch({
          url: '/pages/dog/index',
        });
      }
    }
  } else {
    uni.showToast({
      title: '已取消登录',
      duration: 500,
      icon: 'none',
    });
  }
};

//记录推广关系
const onSetShareInfo = (item: { rece_user_id: string; share_user_id: string }) => {
  setShareInfo(item);
};

onShow(async () => {
  await useUserStoreHook().getSign();
  mallconfig.value = uni.getStorageSync('mallconfig') || 0;
});
</script>

<style lang="scss" scoped>
@import '../../static/css/mixin.scss';

.phoneBtn {
  background-color: #31a7fb;
  color: white;
  padding-left: 20px;
  padding-right: 20px;
  border-radius: 10px;
  margin-top: 20px;
}
.page {
  background-color: #fff;
  height: 100vh;
}

.codebtn {
  line-height: 35px;
  height: 35px;
  background: #f5760d;
  font-size: 1em;
}

.logo {
  @include flex-row(center);
  padding-top: 276rpx;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;

  // font-family: Arial, sans-serif; /* 选择通用的无衬线字体 */
  // font-size: 35px; /* 设置字体大小 */
  // font-weight: bold; /* 设置字体为粗体 */
  // color: #fc39a3; /* 指定字体颜色 */
  // text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); /* 添加阴影效果 */
  // /* 使用渐变背景创建炫彩文字效果（可选） */
  // background: linear-gradient(45deg, #fc39a3, #ff5fb7);
  // -webkit-background-clip: text;
}

.pad-login-bot {
  padding-bottom: 224rpx;
}

.logo_img {
  width: 200px;
  border-radius: 10px; /* 设置圆角半径 */
  margin-right: 5px;
}
.ql-align-center {
  text-align: center;
}
.protocol {
  display: flex;
  justify-content: center;
}

.hj-input {
  margin-top: 15rpx;
}

.hj-input:nth-child(2) {
  margin-top: 35rpx;
}

.login-box {
  top: 600rpx;
  position: absolute;
  width: 100%;
  // left: 10%;
  // right: 10%;
  height: 550rpx;
  padding: 30rpx;
  background-color: white;

  .login-card-input {
    // background-color: violet;
    height: 50%;
    padding: 5rpx;
  }

  .login-card-title {
    height: 20%;
    // background-color: black;
    padding: 10rpx;
    display: flex;
    justify-content: center;

    .login-card-title-content {
      font-size: 1.2em;
      color: #3cb79a;
      border-bottom: 3px solid #3cb79a;
    }
  }

  .login-card-loginIn {
    height: 25%;
    display: flex;
    justify-content: center;
    padding: 10rpx;
    align-items: center;

    .login-card-loginIn-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: #f5760d;
      width: 100%;
      font-size: 1.2em;
      height: 80%;
      border-radius: 40rpx;
      color: white;
    }
  }

  .login-bottom-info {
    height: 5%;
    display: flex;
    font-size: 0.7em;
    color: #3cb79a;
    justify-content: end;
  }
}

.tips {
  color: #969898;
  font-size: 0.9em;
}

.bottom-message {
  position: absolute;
  height: 70rpx;
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  color: #969898;
  bottom: 40rpx;
}
</style>
<style>
#loginphone .addressView {
  display: flex;
  justify-content: left;
}

#loginphone .addressViewText {
  color: #606266;
}
</style>
